import React from 'react';
import { Icon, Grid } from 'antd-mobile';
import { StickyContainer } from 'react-sticky';
import StickyNav from 'components/StickyNav';
import { connect } from 'umi';

import { ZtFooter } from 'components/ZtFooter';
// import Example6 from './components/Example6'

class App extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {}

  //  跳转对应子应用
  onClickApp = (param) => {
    console.log('param', param);
  };

  render() {
    const data = [
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: '专题',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: '专题',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: '专题',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: '专题',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: '专题',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: 'name',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: 'name',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: 'name',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: 'name',
      },
      {
        id: 'id1',
        icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
        text: 'name',
      },
    ];

    return (
      <StickyContainer>
        <StickyNav
          title={'h5 管理'}
          mode="light"
          // icon={<Icon type="left"/>}
          onLeftClick={() => console.log('onLeftClick')}
        />

        {/*下拉列表*/}
        <Grid
          columnNum={3}
          onClick={this.onClickApp}
          data={data}
          activeStyle={false}
        />
      </StickyContainer>
    );
  }
}

export default connect(({ indexModel }) => ({
  indexModel,
}))(App);
